<template>
  <div>
    <el-breadcrumb separator="/">
      <el-breadcrumb-item :to="{ path: '/admin/base/home' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>数据统计分析</el-breadcrumb-item>
      <el-breadcrumb-item>报修统计管理</el-breadcrumb-item>
    </el-breadcrumb>
    <el-divider></el-divider>
    <h1 style="font-size: 50px">报表图-报修</h1>

    <div ref="myChart" id="myChart" style="width: 100%;height: 700px">


    </div>
  </div>
</template>

<script>
import * as echarts from 'echarts';

export default {
  data() {
    return {

      Arr1: [],
      Arr2: [],
    }
  },
  created: function () {
    this.axios.get("http://localhost:8080/report/for/repair/type").then((response) => {
      this.Arr1 = response.data.data;
      let myEcharts = echarts.init(this.$refs.myChart)
      let xData = this.Arr1
      let data = this.Arr2
      let option = {
        xAxis: {
          type: "category",
          data: xData
        },
        yAxis: {
          type: "value"
        },
        series: [
          {
            data,
            type: "line",
            areaStyle: {},
            smooth: true
          }
        ]
      };
      myEcharts.setOption(option)
    })
    this.axios.get("http://localhost:8080/report/for/repair/data").then((response) => {
      this.Arr2 = response.data.data;
      let myEcharts = echarts.init(this.$refs.myChart)
      let xData = this.Arr1
      let data = this.Arr2
      let option = {
        xAxis: {
          type: "category",
          data: xData
        },
        yAxis: {
          type: "value"
        },
        series: [
          {
            data,
            type: "line",
            areaStyle: {},
            smooth: true
          }
        ]
      };
      myEcharts.setOption(option)
    })


  },
  mounted() {
    let myEcharts = echarts.init(this.$refs.myChart)
    let xData = this.Arr1
    let data = this.Arr2
    let option = {
      xAxis: {
        type: "category",
        data: xData
      },
      yAxis: {
        type: "value"
      },
      series: [
        {
          data,
          type: "line",
          areaStyle: {},
          smooth: true
        }
      ]
    };
    myEcharts.setOption(option)
  },


}
</script>


<style scoped>
#myChart {

}
</style>